<template>
	<div>
		<el-card shadow="never">
			<div style="text-align: left;">
				<el-date-picker class="x_soso" v-model="valueDate" type="daterange" value-format="yyyy-MM-dd" range-separator="至"
				 start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
				<el-button type="primary" @click="searchList">查询</el-button>
			</div>
			<div style="text-align: left;">

				<el-button type="primary" @click="restList">刷新</el-button>
			</div>
			<div style="clear:both"></div>
			<el-table v-loading="loading" :data="tableData" style="width: 100%;margin-top: 20px">
				<el-table-column type="index" width="50"></el-table-column>
				<el-table-column label="流水号" align="center" prop="financeWaterId"></el-table-column>
				<el-table-column label="收入支出" align="center" prop="addorsub">
					<template slot-scope="scope">
						<span v-if="scope.row.addorsub == 1">收入</span>
						<span v-if="scope.row.addorsub == 2">支出</span>
					</template>
				</el-table-column>
				<el-table-column label="金额" align="center" prop="amount"></el-table-column>
				<!-- <el-table-column label="业务类型" align="center" prop="businessType"></el-table-column> -->
				<el-table-column label="业务类型" align="center" prop="remark"></el-table-column>
				<el-table-column label="创建时间" align="center" prop="createTime"></el-table-column>
			</el-table>
			<div style="margin-top: 20px;text-align: right">
				<el-pagination background @current-change="columnFind" :current-page="page.page" :page-size="page.pagesize" layout="prev, pager, next, jumper, total"
				 :total="page.count"></el-pagination>
			</div>
		</el-card>
	</div>
</template>

<script>
	import Cookie from 'js-cookie';
	import {
		getPlatformWaterList
	} from "../../../server/index.js";

	export default {
		inject: ['reload'],
		data() {
			return {
				valueDate: [],
				loading: true,
				tableData: [1],
				search: {},
				searchInput: "",
				page: {
					count: 0,
					pagesize: 10,
					page: 1
				},
				dialogVisible: false
			};
		},
		mounted() {
			var page = 1;
			this.columnFind(page);
			Cookie.remove('tabList');
		},
		methods: {
			searchList() {
				this.columnFind(1);
			},
			restList() {
				this.reload();
			},
			columnFind(page) {
				const _this = this;
				_this.page.page = page;
				let startTime = _this.valueDate[0];
				let endTime = _this.valueDate[1];
				let obj = {
					page: _this.page.page,
					rows: _this.page.pagesize,
					startCreateTime: undefined == startTime ? '' : startTime,
					endCreateTime: undefined == endTime ? '' : endTime,
				};
				_this.http.request({
					url: getPlatformWaterList,
					data: obj,
					success: function(res) {
						_this.loading = false;
						_this.tableData = res.list;
						_this.page.count = res.total;
					},
					error: function(err) {
						_this.$message({
							offset: '200',
							message: err.msg
						})
					}
				});
			}
		}
	};
</script>


<style scoped="scoped" lang="less">
	.el-button--primary {
		background: rgba(113, 106, 202, 1);
		border: none;
	}

	.el-button--primary:hover {
		color: #606266;
		background: rgba(255, 255, 255, 1);
		border: 1px solid rgba(113, 106, 202, 1);
	}
</style>
